<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
    
    <script>
        //1.查出当前用户信息
        //2.按照当前用户的id查出他的课程
        //3.按照当前课程id查出分数
        /* $.ajax({
            url: "mock/user.json",
            success(data) {
                console.log("查询用户：", data);
                $.ajax({
                    url: `mock/user_course_${data.id}.json`,
                    success(data) {
                        console.log("查询到课程：", data);
                        $.ajax({
                            url: `mock/course_score_${data.id}.json`,
                            success(data) {
                                console.log("查询到分数：", data);
                            },
                            error(error) {
                                console.log("出现异常了：", error);
                            }
                        });
                    },
                    error(error) {
                        console.log("出现异常了：", error);
                    }
                });
            },
            error(error) {
                console.log("出现异常了：", error);
            }
        }); */

        // 1）2）Promise可以封装异步操作
        /* let p = new Promise((resolve,reject)=>{
            $.ajax({
                url: "mock/user.json",
                success(data) {
                    resolve(data);
                },
                error(error) {
                    reject(error);
                }
            });
        });

        p.then(function(value){
            console.log(value);
        }).catch(function(error) {
            console.log(error);
        }); */

        // 3）Promise改造以前嵌套方式
        /* new Promise((resolve, reject) => {
            $.ajax({
                url: "mock/user.json",
                success(data) {
                    console.log("查询用户：", data);
                    resolve(data.id);
                },
                error(error) {
                    console.log("出现异常了：", error);
                    reject(error);
                }
            });
        }).then(userId => {
            return new Promise((resolve, reject) => {
                $.ajax({
                    url: `mock/user_course_${userId}.json`,
                    success(data) {
                        console.log("查询到课程：", data);
                        resolve(data.id);
                    },
                    error(error) {
                        console.log("出现异常了：", error);
                        reject(error);
                    }
                });
            });
        }).then(courseId => {
            return new Promise((resolve, reject) => {
                $.ajax({
                    url: `mock/course_score_${courseId}.json`,
                    success(data) {
                        console.log("查询到分数：", data);
                    },
                    error(error) {
                        console.log("出现异常了：", error);
                        reject(error);
                    }
                });
            });
        }).catch(error => {
            console.log("进入catch，出错了", error);
        }); */

        // 4）优化处理
        let get = function(url, data) {
            return new Promise((resolve, reject) => {
                $.ajax({
                    url: url,
                    data: data,
                    success(data) {
                        resolve(data);
                    },
                    error(error) {
                        reject(error);
                    }
                });
            });
        }

        get("mock/user.json").then(data => {
            console.log("查询用户：", data);
            return get(`mock/user_course_${data.id}.json`);
        }).then(data => {
            console.log("查询到课程：", data);
            return get(`mock/course_score_${data.id}.json`);
        }).then(data => {
            console.log("查询到分数：", data);
        }).catch(error => {
            console.log("进入catch，出错了", error);
        });
    </script>
</body>
</html>